<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
    "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="generator" content="AsciiDoc 8.2.1" />
<style type="text/css">
/* Debug borders */
p, li, dt, dd, div, pre, h1, h2, h3, h4, h5, h6 {
/*
  border: 1px solid red;
*/
}

body {
  margin: 1em 5% 1em 5%;
}

a {
  color: blue;
  text-decoration: underline;
}
a:visited {
  color: fuchsia;
}

em {
  font-style: italic;
}

strong {
  font-weight: bold;
}

tt {
  color: navy;
}

h1, h2, h3, h4, h5, h6 {
  color: #527bbd;
  font-family: sans-serif;
  margin-top: 1.2em;
  margin-bottom: 0.5em;
  line-height: 1.3;
}

h1 {
  border-bottom: 2px solid silver;
}
h2 {
  border-bottom: 2px solid silver;
  padding-top: 0.5em;
}

div.sectionbody {
  font-family: serif;
  margin-left: 0;
}

hr {
  border: 1px solid silver;
}

p {
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}

pre {
  padding: 0;
  margin: 0;
}

span#author {
  color: #527bbd;
  font-family: sans-serif;
  font-weight: bold;
  font-size: 1.1em;
}
span#email {
}
span#revision {
  font-family: sans-serif;
}

div#footer {
  font-family: sans-serif;
  font-size: small;
  border-top: 2px solid silver;
  padding-top: 0.5em;
  margin-top: 4.0em;
}
div#footer-text {
  float: left;
  padding-bottom: 0.5em;
}
div#footer-badges {
  float: right;
  padding-bottom: 0.5em;
}

div#preamble,
div.tableblock, div.imageblock, div.exampleblock, div.verseblock,
div.quoteblock, div.literalblock, div.listingblock, div.sidebarblock,
div.admonitionblock {
  margin-right: 10%;
  margin-top: 1.5em;
  margin-bottom: 1.5em;
}
div.admonitionblock {
  margin-top: 2.5em;
  margin-bottom: 2.5em;
}

div.content { /* Block element content. */
  padding: 0;
}

/* Block element titles. */
div.title, caption.title {
  font-family: sans-serif;
  font-weight: bold;
  text-align: left;
  margin-top: 1.0em;
  margin-bottom: 0.5em;
}
div.title + * {
  margin-top: 0;
}

td div.title:first-child {
  margin-top: 0.0em;
}
div.content div.title:first-child {
  margin-top: 0.0em;
}
div.content + div.title {
  margin-top: 0.0em;
}

div.sidebarblock > div.content {
  background: #ffffee;
  border: 1px solid silver;
  padding: 0.5em;
}

div.listingblock {
  margin-right: 0%;
}
div.listingblock > div.content {
  border: 1px solid silver;
  background: #f4f4f4;
  padding: 0.5em;
}

div.quoteblock > div.content {
  padding-left: 2.0em;
}

div.attribution {
  text-align: right;
}
div.verseblock + div.attribution {
  text-align: left;
}

div.admonitionblock .icon {
  vertical-align: top;
  font-size: 1.1em;
  font-weight: bold;
  text-decoration: underline;
  color: #527bbd;
  padding-right: 0.5em;
}
div.admonitionblock td.content {
  padding-left: 0.5em;
  border-left: 2px solid silver;
}

div.exampleblock > div.content {
  border-left: 2px solid silver;
  padding: 0.5em;
}

div.verseblock div.content {
  white-space: pre;
}

div.imageblock div.content { padding-left: 0; }
div.imageblock img { border: 1px solid silver; }
span.image img { border-style: none; }

dl {
  margin-top: 0.8em;
  margin-bottom: 0.8em;
}
dt {
  margin-top: 0.5em;
  margin-bottom: 0;
  font-style: italic;
}
dd > *:first-child {
  margin-top: 0;
}

ul, ol {
    list-style-position: outside;
}
ol.olist2 {
  list-style-type: lower-alpha;
}

div.tableblock > table {
  border: 3px solid #527bbd;
}
thead {
  font-family: sans-serif;
  font-weight: bold;
}
tfoot {
  font-weight: bold;
}

div.hlist {
  margin-top: 0.8em;
  margin-bottom: 0.8em;
}
div.hlist td {
  padding-bottom: 5px;
}
td.hlist1 {
  vertical-align: top;
  font-style: italic;
  padding-right: 0.8em;
}
td.hlist2 {
  vertical-align: top;
}

@media print {
  div#footer-badges { display: none; }
}

div#toctitle {
  color: #527bbd;
  font-family: sans-serif;
  font-size: 1.1em;
  font-weight: bold;
  margin-top: 1.0em;
  margin-bottom: 0.1em;
}

div.toclevel1, div.toclevel2, div.toclevel3, div.toclevel4 {
  margin-top: 0;
  margin-bottom: 0;
}
div.toclevel2 {
  margin-left: 2em;
  font-size: 0.9em;
}
div.toclevel3 {
  margin-left: 4em;
  font-size: 0.9em;
}
div.toclevel4 {
  margin-left: 6em;
  font-size: 0.9em;
}
/* Workarounds for IE6's broken and incomplete CSS2. */

div.sidebar-content {
  background: #ffffee;
  border: 1px solid silver;
  padding: 0.5em;
}
div.sidebar-title, div.image-title {
  font-family: sans-serif;
  font-weight: bold;
  margin-top: 0.0em;
  margin-bottom: 0.5em;
}

div.listingblock div.content {
  border: 1px solid silver;
  background: #f4f4f4;
  padding: 0.5em;
}

div.quoteblock-content {
  padding-left: 2.0em;
}

div.exampleblock-content {
  border-left: 2px solid silver;
  padding-left: 0.5em;
}

/* IE6 sets dynamically generated links as visited. */
div#toc a:visited { color: blue; }
</style>
<script type="text/javascript">
/*<![CDATA[*/
window.onload = function(){generateToc(2)}
/* Author: Mihai Bazon, September 2002
 * http://students.infoiasi.ro/~mishoo
 *
 * Table Of Content generator
 * Version: 0.4
 *
 * Feel free to use this script under the terms of the GNU General Public
 * License, as long as you do not remove or alter this notice.
 */

 /* modified by Troy D. Hanson, September 2006. License: GPL */
 /* modified by Stuart Rackham, October 2006. License: GPL */

function getText(el) {
  var text = "";
  for (var i = el.firstChild; i != null; i = i.nextSibling) {
    if (i.nodeType == 3 /* Node.TEXT_NODE */) // IE doesn't speak constants.
      text += i.data;
    else if (i.firstChild != null)
      text += getText(i);
  }
  return text;
}

function TocEntry(el, text, toclevel) {
  this.element = el;
  this.text = text;
  this.toclevel = toclevel;
}

function tocEntries(el, toclevels) {
  var result = new Array;
  var re = new RegExp('[hH]([2-'+(toclevels+1)+'])');
  // Function that scans the DOM tree for header elements (the DOM2
  // nodeIterator API would be a better technique but not supported by all
  // browsers).
  var iterate = function (el) {
    for (var i = el.firstChild; i != null; i = i.nextSibling) {
      if (i.nodeType == 1 /* Node.ELEMENT_NODE */) {
        var mo = re.exec(i.tagName)
        if (mo)
          result[result.length] = new TocEntry(i, getText(i), mo[1]-1);
        iterate(i);
      }
    }
  }
  iterate(el);
  return result;
}

// This function does the work. toclevels = 1..4.
function generateToc(toclevels) {
  var toc = document.getElementById("toc");
  var entries = tocEntries(document.getElementsByTagName("body")[0], toclevels);
  for (var i = 0; i < entries.length; ++i) {
    var entry = entries[i];
    if (entry.element.id == "")
      entry.element.id = "toc" + i;
    var a = document.createElement("a");
    a.href = "#" + entry.element.id;
    a.appendChild(document.createTextNode(entry.text));
    var div = document.createElement("div");
    div.appendChild(a);
    div.className = "toclevel" + entry.toclevel;
    toc.appendChild(div);
  }
}
/*]]>*/
</script>
<title>Basic Tutorial</title>
</head>
<body>
<div id="header">
<h1>Basic Tutorial</h1>
<div id="toc">
  <div id="toctitle">Table of Contents</div>
  <noscript><p><b>JavaScript must be enabled in your browser to display the table of contents.</b></p></noscript>
</div>
</div>
<div id="preamble">
<div class="sectionbody">
<div class="admonitionblock">
<table><tr>
<td class="icon">
<img src="./images/icons/note.png" alt="Note" />
</td>
<td class="content">The full source code of this tutorial is available in the <em>demos/tutorial</em> directory.</td>
</tr></table>
</div>
</div>
</div>
<h2>1. How LuaGame Works (sorta)</h2>
<div class="sectionbody">
<p>LuaGame is an execution environment for games. It exposes a good amount of the
functionality of SDL, and extends it with a standard library. LuaGame is <strong>not</strong>
a game engine. It provides enough features to easily build one, but it is much
more general. This tutorial should give one a good enough understanding of the
basics of writing games in LuaGame. It's recommended that one learn the basics
of Lua before reading the rest of this tutorial, although it's not required.</p>
<p>Games in LuaGame must contain at least two files, <em>scripts/config.lua</em> and
<em>base/init.lua</em>. Ideally, one will use the base library, in which case the file
<em>scripts/main.lua</em> is also required.</p>
<p>The basic directory structure of a game is as follows:</p>
<div class="literalblock">
<div class="content">
<pre><tt> gamedir
 |-base
 |-scripts
 |-&lt;extra dir-1&gt;
    ...
 \-&lt;extra dir-n&gt;</tt></pre>
</div></div>
<div class="admonitionblock">
<table><tr>
<td class="icon">
<img src="./images/icons/note.png" alt="Note" />
</td>
<td class="content">
<div class="title">Paths</div>
<p>The <em>gamedir</em> directory is the base path of the game. All resources (scripts,
images, sounds, etc&#8230;) must be referenced relative to that.</p>
<p>Ex: script <em>somescript.lua</em> is in <em>scripts/somescript.lua</em></p>
</td>
</tr></table>
</div>
<p>When LuaGame is executed in the <em>gamedir</em> directory or with the path to <em>gamedir</em>
as an argument, it will do the following:</p>
<ol>
<li>
<p>
run the <em>config.lua</em> script
</p>
</li>
<li>
<p>
initialize output surface
</p>
</li>
<li>
<p>
run <em>base/init.lua</em>
</p>
</li>
<li>
<p>
the init script will run <em>scripts/main.lua</em> (if one is using the base library)
</p>
</li>
</ol>
<div class="admonitionblock">
<table><tr>
<td class="icon">
<img src="./images/icons/tip.png" alt="Tip" />
</td>
<td class="content">
<div class="title">Why We Copy the <em>base</em> Directory</div>
<p>We copy the <em>base</em> directory (instead of installing it globally in perhaps $PREFIX/share)
because it allows one to change any part of it that they feel is necessary. For
example, one can extend the library or change the API and by having it separate,
it keeps it from breaking compatibility with any other LuaGame-based games. Also,
it's pretty small, and won't add significant weight to distributables.</p>
<p>Installing it globally also has the problem of making it more difficult to use
LuaGame on Windows and Mac OSX (for both developer and end-user).</p>
</td>
</tr></table>
</div>
</div>
<h2>2. Getting Started</h2>
<div class="sectionbody">
<h3>2.1. Initialize the Game Directory</h3>
<p>Create a new directory and copy the <em>base</em> directory into it (if you want to use
the base library, and you do).</p>
<p>Now, create the <em>scripts</em> directory and create a file called <em>config.lua</em> in it.
Into that file place the following lines:</p>
<div class="listingblock">
<div class="content"><!-- Generator: GNU source-highlight 2.4
by Lorenzo Bettini
http://www.lorenzobettini.it
http://www.gnu.org/software/src-highlite -->
<pre><tt><span style="font-style: italic"><span style="color: #9A1900">--variables that define the</span></span>
<span style="font-style: italic"><span style="color: #9A1900">--screen properties</span></span>
s_width <span style="color: #990000">=</span> <span style="color: #993399">640</span>
s_height <span style="color: #990000">=</span> <span style="color: #993399">480</span>
s_depth <span style="color: #990000">=</span> <span style="color: #993399">32</span>
s_fullscreen <span style="color: #990000">=</span> <span style="color: #993399">0</span>

<span style="font-style: italic"><span style="color: #9A1900">--the name of the game. Appears in titlebar</span></span>
s_gamename <span style="color: #990000">=</span> <span style="color: #FF0000">"my game"</span>
</tt></pre></div></div>
<p>The variable names should be self-explanatory. I'd recommend leaving s_depth at 32
because it makes life a lot easier.</p>
<p>Also, in <em>scripts</em>, create a blank file named <em>main.lua</em>. The directory is now
set up and when run with LuaGame, it will produce a 640x480 window that will
instantly disappear.</p>
<h3>2.2. Keeping the Window Open</h3>
<p>To keep the window open, one needs to add the main game loop to the <em>main.lua</em> file.</p>
<p>So, just add this code to <em>main.lua</em>:</p>
<div class="listingblock">
<div class="content"><!-- Generator: GNU source-highlight 2.4
by Lorenzo Bettini
http://www.lorenzobettini.it
http://www.gnu.org/software/src-highlite -->
<pre><tt><span style="font-style: italic"><span style="color: #9A1900">--controls main game loop</span></span>
done <span style="color: #990000">=</span> <span style="font-weight: bold"><span style="color: #0000FF">false</span></span>

<span style="font-style: italic"><span style="color: #9A1900">--main game loop</span></span>
<span style="font-weight: bold"><span style="color: #0000FF">while</span></span> done <span style="color: #990000">~=</span> <span style="font-weight: bold"><span style="color: #0000FF">true</span></span> <span style="font-weight: bold"><span style="color: #0000FF">do</span></span>

<span style="font-weight: bold"><span style="color: #0000FF">end</span></span>
</tt></pre></div></div>
<p>If one runs this right now, it will produce a window that can't be closed except
by interrupting (Ctrl-C) LuaGame. We're going to fix that in the next section, but
we're going to reduce the CPU usage of the game first using an FPSManager.</p>
<p>The FPSManager is a class to handle proper delays and will attempt to run the main
game loop at the chosen FPS. Add it to the code like so:</p>
<div class="listingblock">
<div class="content"><!-- Generator: GNU source-highlight 2.4
by Lorenzo Bettini
http://www.lorenzobettini.it
http://www.gnu.org/software/src-highlite -->
<pre><tt><span style="font-style: italic"><span style="color: #9A1900">--controls main game loop</span></span>
done <span style="color: #990000">=</span> <span style="font-weight: bold"><span style="color: #0000FF">false</span></span>

fps <span style="color: #990000">=</span> <span style="font-weight: bold"><span style="color: #000000">FPSManager:new</span></span><span style="color: #990000">()</span> <span style="font-style: italic"><span style="color: #9A1900">-- create the FPSManager object</span></span>
<span style="font-weight: bold"><span style="color: #000000">fps:set_fps</span></span><span style="color: #990000">(</span><span style="color: #993399">30</span><span style="color: #990000">)</span> <span style="font-style: italic"><span style="color: #9A1900">-- set the FPS to 30</span></span>

<span style="font-style: italic"><span style="color: #9A1900">--main game loop</span></span>
<span style="font-weight: bold"><span style="color: #0000FF">while</span></span> done <span style="color: #990000">~=</span> <span style="font-weight: bold"><span style="color: #0000FF">true</span></span> <span style="font-weight: bold"><span style="color: #0000FF">do</span></span>
  <span style="font-weight: bold"><span style="color: #000000">fps:update</span></span><span style="color: #990000">()</span> <span style="font-style: italic"><span style="color: #9A1900">-- delay to ensure proper FPS</span></span>
<span style="font-weight: bold"><span style="color: #0000FF">end</span></span>
</tt></pre></div></div>
<p>The <strong>fps:update()</strong> call should/must come at the end of the main game loop. This
tutorial covers frame-based games. For smoother animation, one should use deltas.
LuaGames supports this, but using it is beyond the scope of this tutorial.</p>
<h3>2.3. Introduction to Events</h3>
<p>It's now time to add an EventManager to deal with the mouse, keyboard, and joystick
events that your game will encounter. The EventManager class is designed such
that one can create an arbitrary number of them and then just use them at the
appropriate time.</p>
<div class="admonitionblock">
<table><tr>
<td class="icon">
<img src="./images/icons/tip.png" alt="Tip" />
</td>
<td class="content">
<p>For any real game, it's recommended that one put
all declarations of EventManagers into a separate
file for clarity (they can get pretty big).</p>
</td>
</tr></table>
</div>
<p>Adding an EventManager is easy. Just add the following code to your <em>main.lua</em>
above the main game loop.</p>
<div class="listingblock">
<div class="content"><!-- Generator: GNU source-highlight 2.4
by Lorenzo Bettini
http://www.lorenzobettini.it
http://www.gnu.org/software/src-highlite -->
<pre><tt>evman <span style="color: #990000">=</span> <span style="font-weight: bold"><span style="color: #000000">EventManager:new</span></span><span style="color: #990000">()</span>
evman<span style="color: #990000">.</span>quit <span style="color: #990000">=</span> <span style="font-weight: bold"><span style="color: #0000FF">function</span></span> <span style="color: #990000">()</span> done <span style="color: #990000">=</span> <span style="font-weight: bold"><span style="color: #0000FF">true</span></span> <span style="font-weight: bold"><span style="color: #0000FF">end</span></span>
evman<span style="color: #990000">.</span>keyboard<span style="color: #990000">.</span>pressed<span style="color: #990000">[</span>Keys<span style="color: #990000">.</span>ESCAPE<span style="color: #990000">]</span> <span style="color: #990000">=</span> <span style="font-weight: bold"><span style="color: #0000FF">function</span></span><span style="color: #990000">()</span> done <span style="color: #990000">=</span> <span style="font-weight: bold"><span style="color: #0000FF">true</span></span> <span style="font-weight: bold"><span style="color: #0000FF">end</span></span>
</tt></pre></div></div>
<p>This creates an event manager and adds two events to it. The first event is the
event fired when a user tries to close the window. The second is the event that
occurs when one presses the escape key. When either event occurs, it causes the
main game loop to exit. Notice, the events are assigned functions (in this case
they're anonymous, but they just need to be functions). These functions are run
when the events occur.</p>
<div class="admonitionblock">
<table><tr>
<td class="icon">
<img src="./images/icons/tip.png" alt="Tip" />
</td>
<td class="content">
<p>Functions are first-class values in Lua, that is, they can be passed and
assigned just like any other variable. In the above example, anonymous functions
are used. However, it's just as easy to use previously declared functions. See
the documentation for the <strong>EventManager</strong> class for an example of using events
and object methods together (HINT: Write a wrapper function.)</p>
</td>
</tr></table>
</div>
<p>However, nothing's going to happen with just the declarations. We need to add a
method call to the game loop to actually process any events.</p>
<p>So, at the beginning of the main game loop, add this line:</p>
<div class="listingblock">
<div class="content"><!-- Generator: GNU source-highlight 2.4
by Lorenzo Bettini
http://www.lorenzobettini.it
http://www.gnu.org/software/src-highlite -->
<pre><tt><span style="font-weight: bold"><span style="color: #000000">evman:gather_events</span></span><span style="color: #990000">()</span>
</tt></pre></div></div>
<p>That's pretty much all there is to event managers. Mouse and especially joystick
handling is a little harder, but that's for another tutorial.</p>
<div class="admonitionblock">
<table><tr>
<td class="icon">
<img src="./images/icons/tip.png" alt="Tip" />
</td>
<td class="content">
<p>As is probably obvious now, making multiple event managers is an easy way to
have multiple input contexts. By naming functions, common events don't need to
have redundant code, and overall, it reduces the complexity of handling events.</p>
</td>
</tr></table>
</div>
</div>
<h2>3. Objects</h2>
<div class="sectionbody">
<h3>3.1. Explanation of Objects</h3>
<p>Objects in LuaGame are what one should be extending to create the actors in their
games. The Object class is very much like a sprite class. It has a <strong>draw()</strong> method,
an <strong>update()</strong> method, and an empty <strong>collide()</strong> method.</p>
<p>It is expected that all Objects (pure and inherited) have the three methods
mentioned above. This comes into effect later with the ObjectList's convenience
methods.</p>
<p>Besides those three methods, Objects have a position, heading, speed, rotation,
and image.</p>
<h3>3.2. Extending the Object</h3>
<p>For the most part, one doesn't want to use the Object class directly. Thus, it is
imperative to extend it to fit one's needs. Object Orientation in Lua is pretty
simple. It's beyond the scope of this tutorial to cover the how or why it works.</p>
<p>Inheritance starts by making the new class be an instance of the base class,
in this case <strong>Object</strong>. The <strong>type</strong> property needs to be set to the name of the new
class for the sake of collision detection and just to be able to identify them
since classes are just tables.</p>
<div class="listingblock">
<div class="content"><!-- Generator: GNU source-highlight 2.4
by Lorenzo Bettini
http://www.lorenzobettini.it
http://www.gnu.org/software/src-highlite -->
<pre><tt>MyObj <span style="color: #990000">=</span> <span style="font-weight: bold"><span style="color: #000000">Object:new</span></span><span style="color: #990000">()</span>

MyObj<span style="color: #990000">.</span>type <span style="color: #990000">=</span> <span style="color: #FF0000">"MyObj"</span>
MyObj<span style="color: #990000">.</span>rects <span style="color: #990000">=</span> <span style="font-weight: bold"><span style="color: #000000">ObjectList:new</span></span><span style="color: #990000">()</span> <span style="font-style: italic"><span style="color: #9A1900">-- we'll come back to this</span></span>
</tt></pre></div></div>
<p>The <strong>Object:new()</strong> method is what makes the object orientation work. However, we
need to create a <strong>new()</strong> method for the new class to make the inheritance work.</p>
<div class="listingblock">
<div class="content"><!-- Generator: GNU source-highlight 2.4
by Lorenzo Bettini
http://www.lorenzobettini.it
http://www.gnu.org/software/src-highlite -->
<pre><tt><span style="font-weight: bold"><span style="color: #0000FF">function</span></span> <span style="font-weight: bold"><span style="color: #000000">MyObj:new</span></span><span style="color: #990000">(</span>o<span style="color: #990000">)</span>
  o <span style="color: #990000">=</span> o <span style="font-weight: bold"><span style="color: #0000FF">or</span></span> <span style="color: #FF0000">{}</span>
  <span style="font-weight: bold"><span style="color: #000000">setmetatable</span></span><span style="color: #990000">(</span>o<span style="color: #990000">,</span> self<span style="color: #990000">)</span>
  self<span style="color: #990000">.</span>__index <span style="color: #990000">=</span> self
  <span style="font-weight: bold"><span style="color: #0000FF">return</span></span> o
<span style="font-weight: bold"><span style="color: #0000FF">end</span></span>
</tt></pre></div></div>
<p>Due to the fact that <strong>MyObj</strong> is also an <strong>Object</strong>, the methods of <strong>Object</strong> can be
run on an instance of <strong>MyObj</strong>. But, for the sake of clarity (at least for now), we'll
add a <strong>MyObj:update()</strong> method.</p>
<div class="listingblock">
<div class="content"><!-- Generator: GNU source-highlight 2.4
by Lorenzo Bettini
http://www.lorenzobettini.it
http://www.gnu.org/software/src-highlite -->
<pre><tt><span style="font-weight: bold"><span style="color: #0000FF">function</span></span> <span style="font-weight: bold"><span style="color: #000000">MyObj:update</span></span><span style="color: #990000">(</span>delta<span style="color: #990000">)</span>
  Object<span style="color: #990000">.</span><span style="font-weight: bold"><span style="color: #000000">update</span></span><span style="color: #990000">(</span>self<span style="color: #990000">,</span> delta<span style="color: #990000">)</span>
<span style="font-weight: bold"><span style="color: #0000FF">end</span></span>
</tt></pre></div></div>
<p>For the most part, this is entirely redundant code. But it showcases two things.
Number one, the update method should accept a single variable that allows for
the use of time deltas (required for time-based games). Number two, accessing
a function in a table using the ":" operator instead of "." passes a hidden
first argument <em>self</em> which is the table that the function is being called on.</p>
<p>However, by defining the <strong>update()</strong> method we can extend it to do more than
the base <strong>Object</strong> does, or we can exclude the call to <strong>Object.update(self,delta)</strong>
entirely and write our own code.</p>
<h3>3.3. Making MyObj Do More</h3>
<p>At the moment, <strong>MyObj</strong> is basically just an <strong>Object</strong> with a different name. That's
pretty boring, so we're going to make it do something a little different.</p>
<p>Say we want to take this lovely image <span class="image">
<img src="images/wikilogo.png" alt="images/wikilogo.png" />
</span> and make it move
around on the screen. We need to set the <strong>MyObj.image</strong> property to be that image. So,
go ahead and download that image and place it in <em>gamedir</em>, perhaps in <em>data/images</em>.</p>
<p>To actually load this image into <strong>MyObj</strong>, add the following code somewhere underneath
the initial declaration.</p>
<div class="listingblock">
<div class="content"><!-- Generator: GNU source-highlight 2.4
by Lorenzo Bettini
http://www.lorenzobettini.it
http://www.gnu.org/software/src-highlite -->
<pre><tt>MyObj<span style="color: #990000">.</span>image<span style="color: #990000">,</span> MyObj<span style="color: #990000">.</span>w<span style="color: #990000">,</span> MyObj<span style="color: #990000">.</span>h <span style="color: #990000">=</span> <span style="font-weight: bold"><span style="color: #000000">get_image</span></span><span style="color: #990000">(</span><span style="color: #FF0000">"data/images/wikilogo.png"</span><span style="color: #990000">)</span>
</tt></pre></div></div>
<div class="admonitionblock">
<table><tr>
<td class="icon">
<img src="./images/icons/tip.png" alt="Tip" />
</td>
<td class="content">
<p>The <strong>get_image()</strong> function loads up an image into the global image store. If the
image has already been loaded, then it just returns it. To free an image from the
global store, use <strong>release_image()</strong>. Note that the image is specified by its path
relative to <em>gamedir</em>. To prevent a new copy from being loaded the exact same path
must be used for all references to the image.</p>
</td>
</tr></table>
</div>
<p>Now that the image is loaded, all that's left to do is make it move around in an
interesting way. The easiest interesting thing to do is make it bounce around, so
we're going to do just that. It will bounce off the edges of the screen from the
center. The <strong>MyObj:update()</strong> method is now going to look like this:</p>
<div class="listingblock">
<div class="content"><!-- Generator: GNU source-highlight 2.4
by Lorenzo Bettini
http://www.lorenzobettini.it
http://www.gnu.org/software/src-highlite -->
<pre><tt><span style="font-weight: bold"><span style="color: #0000FF">function</span></span> <span style="font-weight: bold"><span style="color: #000000">MyObj:reflect_x</span></span><span style="color: #990000">()</span>
  self<span style="color: #990000">.</span>heading <span style="color: #990000">=</span> <span style="color: #990000">(-</span><span style="color: #993399">1</span> <span style="color: #990000">*</span> self<span style="color: #990000">.</span>heading<span style="color: #990000">)</span> <span style="color: #990000">+</span> <span style="color: #993399">180</span>
  self<span style="color: #990000">.</span>heading <span style="color: #990000">=</span> self<span style="color: #990000">.</span>heading <span style="color: #990000">%</span> <span style="color: #993399">360</span>
<span style="font-weight: bold"><span style="color: #0000FF">end</span></span>

<span style="font-weight: bold"><span style="color: #0000FF">function</span></span> <span style="font-weight: bold"><span style="color: #000000">MyObj:reflect_y</span></span><span style="color: #990000">()</span>
  self<span style="color: #990000">.</span>heading <span style="color: #990000">=</span> <span style="color: #990000">-</span><span style="color: #993399">1</span> <span style="color: #990000">*</span> self<span style="color: #990000">.</span>heading
  self<span style="color: #990000">.</span>heading <span style="color: #990000">=</span> self<span style="color: #990000">.</span>heading <span style="color: #990000">%</span> <span style="color: #993399">360</span>
<span style="font-weight: bold"><span style="color: #0000FF">end</span></span>

<span style="font-weight: bold"><span style="color: #0000FF">function</span></span> <span style="font-weight: bold"><span style="color: #000000">MyObj:update</span></span><span style="color: #990000">(</span>delta<span style="color: #990000">)</span>
  Object<span style="color: #990000">.</span><span style="font-weight: bold"><span style="color: #000000">update</span></span><span style="color: #990000">(</span>self<span style="color: #990000">,</span> delta<span style="color: #990000">)</span>

  <span style="font-style: italic"><span style="color: #9A1900">--this code is what makes it bounce</span></span>
  <span style="font-weight: bold"><span style="color: #0000FF">local</span></span> cx<span style="color: #990000">,</span> cy <span style="color: #990000">=</span> Object<span style="color: #990000">.</span><span style="font-weight: bold"><span style="color: #000000">get_center</span></span><span style="color: #990000">(</span>self<span style="color: #990000">)</span>

  <span style="font-weight: bold"><span style="color: #0000FF">if</span></span> cx <span style="color: #990000">&lt;=</span> <span style="color: #993399">0</span> <span style="font-weight: bold"><span style="color: #0000FF">then</span></span>
    self<span style="color: #990000">.</span>x <span style="color: #990000">=</span> <span style="color: #993399">0</span> <span style="color: #990000">-</span> math<span style="color: #990000">.</span><span style="font-weight: bold"><span style="color: #000000">floor</span></span><span style="color: #990000">(</span>self<span style="color: #990000">.</span>w<span style="color: #990000">/</span><span style="color: #993399">2</span><span style="color: #990000">)</span>
    <span style="font-weight: bold"><span style="color: #000000">self:reflect_x</span></span><span style="color: #990000">()</span>
  <span style="font-weight: bold"><span style="color: #0000FF">end</span></span>

  <span style="font-weight: bold"><span style="color: #0000FF">if</span></span> cx <span style="color: #990000">&gt;=</span> s_width <span style="font-weight: bold"><span style="color: #0000FF">then</span></span>
    self<span style="color: #990000">.</span>x <span style="color: #990000">=</span> s_width <span style="color: #990000">-</span> math<span style="color: #990000">.</span><span style="font-weight: bold"><span style="color: #000000">floor</span></span><span style="color: #990000">(</span>self<span style="color: #990000">.</span>w<span style="color: #990000">/</span><span style="color: #993399">2</span><span style="color: #990000">)</span>
    <span style="font-weight: bold"><span style="color: #000000">self:reflect_x</span></span><span style="color: #990000">()</span>
  <span style="font-weight: bold"><span style="color: #0000FF">end</span></span>

  <span style="font-weight: bold"><span style="color: #0000FF">if</span></span> cy <span style="color: #990000">&lt;=</span> <span style="color: #993399">0</span> <span style="font-weight: bold"><span style="color: #0000FF">then</span></span>
    self<span style="color: #990000">.</span>y <span style="color: #990000">=</span> <span style="color: #993399">0</span> <span style="color: #990000">-</span> math<span style="color: #990000">.</span><span style="font-weight: bold"><span style="color: #000000">floor</span></span><span style="color: #990000">(</span>self<span style="color: #990000">.</span>h<span style="color: #990000">/</span><span style="color: #993399">2</span><span style="color: #990000">)</span>
    <span style="font-weight: bold"><span style="color: #000000">self:reflect_y</span></span><span style="color: #990000">()</span>
  <span style="font-weight: bold"><span style="color: #0000FF">end</span></span>

  <span style="font-weight: bold"><span style="color: #0000FF">if</span></span> cy <span style="color: #990000">&gt;=</span> s_height <span style="font-weight: bold"><span style="color: #0000FF">then</span></span>
    self<span style="color: #990000">.</span>y <span style="color: #990000">=</span> s_height <span style="color: #990000">-</span> math<span style="color: #990000">.</span><span style="font-weight: bold"><span style="color: #000000">floor</span></span><span style="color: #990000">(</span>self<span style="color: #990000">.</span>h<span style="color: #990000">/</span><span style="color: #993399">2</span><span style="color: #990000">)</span>
    <span style="font-weight: bold"><span style="color: #000000">self:reflect_y</span></span><span style="color: #990000">()</span>
  <span style="font-weight: bold"><span style="color: #0000FF">end</span></span>
<span style="font-weight: bold"><span style="color: #0000FF">end</span></span>
</tt></pre></div></div>
<p>For the purpose of reducing clutter, we've also added two methods to handle
angle of reflection.</p>
<p>For now, we're done with <strong>MyObj</strong>. We'll be coming back to it shortly.</p>
</div>
<h2>4. Putting it Together</h2>
<div class="sectionbody">
<h3>4.1. Making a MyObj</h3>
<p>Now that we've got a basic object, we're going to actually do something with it.
So, we need to create one and add it to the main game loop. Place the following
code somewhere above the loop.</p>
<div class="listingblock">
<div class="content"><!-- Generator: GNU source-highlight 2.4
by Lorenzo Bettini
http://www.lorenzobettini.it
http://www.gnu.org/software/src-highlite -->
<pre><tt><span style="font-style: italic"><span style="color: #9A1900">--create a MyObj</span></span>
mo <span style="color: #990000">=</span> <span style="font-weight: bold"><span style="color: #000000">MyObj:new</span></span><span style="color: #990000">()</span>
math<span style="color: #990000">.</span><span style="font-weight: bold"><span style="color: #000000">randomseed</span></span><span style="color: #990000">(</span>os<span style="color: #990000">.</span><span style="font-weight: bold"><span style="color: #000000">time</span></span><span style="color: #990000">())</span>
mo<span style="color: #990000">.</span>heading <span style="color: #990000">=</span> math<span style="color: #990000">.</span><span style="font-weight: bold"><span style="color: #000000">random</span></span><span style="color: #990000">(</span><span style="color: #993399">15</span><span style="color: #990000">,</span><span style="color: #993399">75</span><span style="color: #990000">)</span> <span style="font-style: italic"><span style="color: #9A1900">-- prevent shallow angles</span></span>
mo<span style="color: #990000">.</span>speed <span style="color: #990000">=</span> <span style="color: #993399">3</span>
mo<span style="color: #990000">.</span>angular_velocity <span style="color: #990000">=</span> <span style="color: #993399">8</span>
</tt></pre></div></div>
<p>What this does, is create a new object, assign a random heading to it, give it a
speed of 3 pixels per frame, and an angular velocity of 8 degrees per frame.
Angular velocity is how fast the image will rotate.</p>
<div class="admonitionblock">
<table><tr>
<td class="icon">
<img src="./images/icons/note.png" alt="Note" />
</td>
<td class="content">
<div class="title">About Rotation</div>
<p>When rotating an image, if it is a transparent PNG, it needs to be 32-bit, otherwise
there will be an ugly background that rotates along with it.</p>
</td>
</tr></table>
</div>
<p>If you were to run the game now, nothing would happen. That's because the object
isn't being drawn to the screen. By adding three lines in the main game loop, we
can remedy this.</p>
<div class="listingblock">
<div class="content"><!-- Generator: GNU source-highlight 2.4
by Lorenzo Bettini
http://www.lorenzobettini.it
http://www.gnu.org/software/src-highlite -->
<pre><tt>  <span style="font-weight: bold"><span style="color: #000000">mo:update</span></span><span style="color: #990000">()</span>
  <span style="font-weight: bold"><span style="color: #000000">mo:draw</span></span><span style="color: #990000">()</span>
  <span style="font-weight: bold"><span style="color: #000000">update_screen</span></span><span style="color: #990000">()</span>
</tt></pre></div></div>
<p>The first line updates the object, the second draws it, and the third updates
the screen so that everything that was drawn is visible. If we didn't update the
screen then it would stay black and that's not very fun at all.</p>
<p>Running the code now should produce something that vaguely resembles modern art.
This isn't really what we wanted. We wanted just the object, not the trail it
leaves (however pretty). So, we need to add a line to the game loop before we
draw the object to clear the screen to black.</p>
<div class="listingblock">
<div class="content"><!-- Generator: GNU source-highlight 2.4
by Lorenzo Bettini
http://www.lorenzobettini.it
http://www.gnu.org/software/src-highlite -->
<pre><tt>  <span style="font-weight: bold"><span style="color: #000000">fill_screen</span></span><span style="color: #990000">(</span><span style="color: #993399">0</span><span style="color: #990000">,</span><span style="color: #993399">0</span><span style="color: #990000">,</span><span style="color: #993399">0</span><span style="color: #990000">)</span>
</tt></pre></div></div>
<h3>4.2. Making Many MyObj's</h3>
<p>Now that we've made one, why not make a few more? The <em>main.lua</em> should now look
like the code below.</p>
<div class="listingblock">
<div class="content"><!-- Generator: GNU source-highlight 2.4
by Lorenzo Bettini
http://www.lorenzobettini.it
http://www.gnu.org/software/src-highlite -->
<pre><tt>evman<span style="color: #990000">.</span>quit <span style="color: #990000">=</span> <span style="font-weight: bold"><span style="color: #0000FF">function</span></span> <span style="color: #990000">()</span> done <span style="color: #990000">=</span> <span style="font-weight: bold"><span style="color: #0000FF">true</span></span> <span style="font-weight: bold"><span style="color: #0000FF">end</span></span>
evman<span style="color: #990000">.</span>keyboard<span style="color: #990000">.</span>pressed<span style="color: #990000">[</span>Keys<span style="color: #990000">.</span>ESCAPE<span style="color: #990000">]</span> <span style="color: #990000">=</span> <span style="font-weight: bold"><span style="color: #0000FF">function</span></span><span style="color: #990000">()</span> done <span style="color: #990000">=</span> <span style="font-weight: bold"><span style="color: #0000FF">true</span></span> <span style="font-weight: bold"><span style="color: #0000FF">end</span></span>

<span style="font-style: italic"><span style="color: #9A1900">--controls main game loop</span></span>
done <span style="color: #990000">=</span> <span style="font-weight: bold"><span style="color: #0000FF">false</span></span>

fps <span style="color: #990000">=</span> <span style="font-weight: bold"><span style="color: #000000">FPSManager:new</span></span><span style="color: #990000">()</span> <span style="font-style: italic"><span style="color: #9A1900">-- create the FPSManager object</span></span>
<span style="font-weight: bold"><span style="color: #000000">fps:set_fps</span></span><span style="color: #990000">(</span><span style="color: #993399">30</span><span style="color: #990000">)</span> <span style="font-style: italic"><span style="color: #9A1900">-- set the FPS to 30</span></span>

<span style="font-style: italic"><span style="color: #9A1900">--create a MyObj</span></span>
mo <span style="color: #990000">=</span> <span style="font-weight: bold"><span style="color: #000000">MyObj:new</span></span><span style="color: #990000">()</span>
math<span style="color: #990000">.</span><span style="font-weight: bold"><span style="color: #000000">randomseed</span></span><span style="color: #990000">(</span>os<span style="color: #990000">.</span><span style="font-weight: bold"><span style="color: #000000">time</span></span><span style="color: #990000">())</span>
mo<span style="color: #990000">.</span>heading <span style="color: #990000">=</span> math<span style="color: #990000">.</span><span style="font-weight: bold"><span style="color: #000000">random</span></span><span style="color: #990000">(</span><span style="color: #993399">15</span><span style="color: #990000">,</span><span style="color: #993399">80</span><span style="color: #990000">)</span> <span style="font-style: italic"><span style="color: #9A1900">-- prevent shallow angles</span></span>
mo<span style="color: #990000">.</span>speed <span style="color: #990000">=</span> <span style="color: #993399">3</span>
mo<span style="color: #990000">.</span>angular_velocity <span style="color: #990000">=</span> <span style="color: #993399">5</span>

<span style="font-style: italic"><span style="color: #9A1900">--create another MyObj</span></span>
mo1 <span style="color: #990000">=</span> <span style="font-weight: bold"><span style="color: #000000">MyObj:new</span></span><span style="color: #990000">()</span>
mo1<span style="color: #990000">.</span>heading <span style="color: #990000">=</span> math<span style="color: #990000">.</span><span style="font-weight: bold"><span style="color: #000000">random</span></span><span style="color: #990000">(</span><span style="color: #993399">15</span><span style="color: #990000">,</span><span style="color: #993399">80</span><span style="color: #990000">)</span>
mo1<span style="color: #990000">.</span>speed <span style="color: #990000">=</span> <span style="color: #993399">3</span>
mo1<span style="color: #990000">.</span>angular_velocity <span style="color: #990000">=</span> <span style="color: #993399">5</span>

<span style="font-style: italic"><span style="color: #9A1900">--create yet another MyObj</span></span>
mo2 <span style="color: #990000">=</span> <span style="font-weight: bold"><span style="color: #000000">MyObj:new</span></span><span style="color: #990000">()</span>
mo2<span style="color: #990000">.</span>heading <span style="color: #990000">=</span> math<span style="color: #990000">.</span><span style="font-weight: bold"><span style="color: #000000">random</span></span><span style="color: #990000">(</span><span style="color: #993399">15</span><span style="color: #990000">,</span><span style="color: #993399">80</span><span style="color: #990000">)</span>
mo2<span style="color: #990000">.</span>speed <span style="color: #990000">=</span> <span style="color: #993399">3</span>
mo2<span style="color: #990000">.</span>angular_velocity <span style="color: #990000">=</span> <span style="color: #993399">5</span>

<span style="font-style: italic"><span style="color: #9A1900">--main game loop</span></span>
<span style="font-weight: bold"><span style="color: #0000FF">while</span></span> done <span style="color: #990000">~=</span> <span style="font-weight: bold"><span style="color: #0000FF">true</span></span> <span style="font-weight: bold"><span style="color: #0000FF">do</span></span>
  <span style="font-weight: bold"><span style="color: #000000">evman:gather_events</span></span><span style="color: #990000">()</span>

  <span style="font-weight: bold"><span style="color: #000000">mo:update</span></span><span style="color: #990000">()</span>
  <span style="font-weight: bold"><span style="color: #000000">mo1:update</span></span><span style="color: #990000">()</span>
  <span style="font-weight: bold"><span style="color: #000000">mo2:update</span></span><span style="color: #990000">()</span>

  <span style="font-weight: bold"><span style="color: #000000">fill_screen</span></span><span style="color: #990000">(</span><span style="color: #993399">0</span><span style="color: #990000">,</span><span style="color: #993399">0</span><span style="color: #990000">,</span><span style="color: #993399">0</span><span style="color: #990000">)</span>

  <span style="font-weight: bold"><span style="color: #000000">mo:draw</span></span><span style="color: #990000">()</span>
  <span style="font-weight: bold"><span style="color: #000000">mo1:draw</span></span><span style="color: #990000">()</span>
  <span style="font-weight: bold"><span style="color: #000000">mo2:draw</span></span><span style="color: #990000">()</span>

  <span style="font-weight: bold"><span style="color: #000000">update_screen</span></span><span style="color: #990000">()</span>
  <span style="font-weight: bold"><span style="color: #000000">fps:update</span></span><span style="color: #990000">()</span> <span style="font-style: italic"><span style="color: #9A1900">-- delay to ensure proper FPS</span></span>
<span style="font-weight: bold"><span style="color: #0000FF">end</span></span>
</tt></pre></div></div>
<p>When the game is run, three <strong>MyObj</strong>'s will be bouncing around the screen. This is
certainly not a game (yet) and for the purposes of this tutorial, it won't be.
Yeah, sorry about that. This tutorial's just to familiarize one with the basics
of LuaGame.</p>
<h3>4.3. Organization Through ObjectList</h3>
<p>We have three <strong>MyObj</strong>'s now, and if we wanted to add more, the main loop would become
cluttered pretty quickly. So, there's a very useful and flexible class called the
<strong>ObjectList</strong>. It is basically a list that stores anything, but it has convenience
methods for <strong>Object</strong>'s for updating and drawing. It also makes doing collision
detection between a large number of objects much easier.</p>
<p>So, we need to create an <strong>ObjectList</strong> and add the three objects to it. Add this
code after the declaration of the three objects.</p>
<div class="listingblock">
<div class="content"><!-- Generator: GNU source-highlight 2.4
by Lorenzo Bettini
http://www.lorenzobettini.it
http://www.gnu.org/software/src-highlite -->
<pre><tt><span style="font-style: italic"><span style="color: #9A1900">--create an ObjectList</span></span>
olist <span style="color: #990000">=</span> <span style="font-weight: bold"><span style="color: #000000">ObjectList:new</span></span><span style="color: #990000">()</span>
<span style="font-weight: bold"><span style="color: #000000">olist:push_back</span></span><span style="color: #990000">(</span>mo<span style="color: #990000">)</span>
<span style="font-weight: bold"><span style="color: #000000">olist:push_back</span></span><span style="color: #990000">(</span>mo1<span style="color: #990000">)</span>
<span style="font-weight: bold"><span style="color: #000000">olist:push_back</span></span><span style="color: #990000">(</span>mo2<span style="color: #990000">)</span>
</tt></pre></div></div>
<p>Now, replace the three update calls with:</p>
<div class="listingblock">
<div class="content"><!-- Generator: GNU source-highlight 2.4
by Lorenzo Bettini
http://www.lorenzobettini.it
http://www.gnu.org/software/src-highlite -->
<pre><tt>  <span style="font-weight: bold"><span style="color: #000000">olist:update</span></span><span style="color: #990000">()</span>
</tt></pre></div></div>
<p>And replace the draw calls with:</p>
<div class="listingblock">
<div class="content"><!-- Generator: GNU source-highlight 2.4
by Lorenzo Bettini
http://www.lorenzobettini.it
http://www.gnu.org/software/src-highlite -->
<pre><tt>  <span style="font-weight: bold"><span style="color: #000000">olist:draw</span></span><span style="color: #990000">()</span>
</tt></pre></div></div>
<p>With that, one now knows the basics of the ObjectList. If one has ever used a C++
STL list, the methods are basically the same.</p>
<h3>4.4. Silly Collision Detection</h3>
<p>This is the last part of the tutorial, and it deals lightly with collision detection
in a very silly example. Since we actually want to have something happen when
two <strong>MyObj</strong>'s collide, we need to add a method to the definition.</p>
<div class="listingblock">
<div class="content"><!-- Generator: GNU source-highlight 2.4
by Lorenzo Bettini
http://www.lorenzobettini.it
http://www.gnu.org/software/src-highlite -->
<pre><tt><span style="font-style: italic"><span style="color: #9A1900">--silly</span></span>
<span style="font-weight: bold"><span style="color: #0000FF">function</span></span> <span style="font-weight: bold"><span style="color: #000000">MyObj:collide</span></span><span style="color: #990000">(</span>ids<span style="color: #990000">,</span> object<span style="color: #990000">)</span>
  <span style="font-weight: bold"><span style="color: #000000">print</span></span><span style="color: #990000">(</span><span style="color: #FF0000">"Ouch! You hit me, "</span><span style="color: #990000">..</span>object<span style="color: #990000">.</span>type<span style="color: #990000">..</span><span style="color: #FF0000">" at "</span><span style="color: #990000">..</span>os<span style="color: #990000">.</span><span style="font-weight: bold"><span style="color: #000000">time</span></span><span style="color: #990000">()..</span><span style="color: #FF0000">"!"</span><span style="color: #990000">)</span>
<span style="font-weight: bold"><span style="color: #0000FF">end</span></span>
</tt></pre></div></div>
<p>This will print out a silly message when two objects collide. However, nothing's
going to happen yet, at least not until we add a collision check to the main loop.
Add it right before the update call.</p>
<div class="listingblock">
<div class="content"><!-- Generator: GNU source-highlight 2.4
by Lorenzo Bettini
http://www.lorenzobettini.it
http://www.gnu.org/software/src-highlite -->
<pre><tt>  <span style="font-weight: bold"><span style="color: #000000">check_collisions_lists</span></span><span style="color: #990000">(</span>olist<span style="color: #990000">,</span> olist<span style="color: #990000">)</span>
</tt></pre></div></div>
<p>Remember way back when we defined the <strong>MyObj</strong> class? We defined the <em>rects</em> property
to be an empty <strong>ObjectList</strong>. This is because we only want to deal with the overall
bounding box, and <strong>MyObj</strong> doesn't have any bounding sub-rectangles.</p>
<div class="admonitionblock">
<table><tr>
<td class="icon">
<img src="./images/icons/tip.png" alt="Tip" />
</td>
<td class="content">
<div class="title">Less Silly Collisions</div>
<p>As an exercise to the reader, implement the objects bouncing off each other.
This will require looking at more than the type of the object that has collided.
Also, for the sake of having professional looking bounces, one can do a great
deal of code to handle objects that are intersecting, or just move their starting
positions so that they don't intersect.</p>
</td>
</tr></table>
</div>
<h3>4.5. The unload() Method</h3>
<p>The Object class defines a method called unload(). This method has undefined
behavior for the Object class itself. However, it's something that one should
use if they plan on making a game with multiple objects/enemies/etc&#8230; that are
not all needed at the same time. An example of this method for the object we
created before is below.</p>
<div class="listingblock">
<div class="content"><!-- Generator: GNU source-highlight 2.4
by Lorenzo Bettini
http://www.lorenzobettini.it
http://www.gnu.org/software/src-highlite -->
<pre><tt><span style="font-weight: bold"><span style="color: #0000FF">function</span></span> <span style="font-weight: bold"><span style="color: #000000">MyObj:unload</span></span><span style="color: #990000">()</span>
        <span style="font-style: italic"><span style="color: #9A1900">--unload the image</span></span>
        <span style="font-weight: bold"><span style="color: #000000">release_image</span></span><span style="color: #990000">(</span><span style="color: #FF0000">"data/images/wikilogo.png"</span><span style="color: #990000">)</span>
        MyObj <span style="color: #990000">=</span> <span style="font-weight: bold"><span style="color: #0000FF">nil</span></span>
<span style="font-weight: bold"><span style="color: #0000FF">end</span></span>
</tt></pre></div></div>
<p>Basically, the image for the object is unloaded and then the class itself is set
to nil and it will be garbage collected. One has to remember never to call this
method unless all objects of the same type as the class have been destroyed and
won't have methods or properties called on them. Otherwise, it will result in an
error being thrown. Since this tutorial is small, this method is unneeded and
isn't actually included.</p>
</div>
<h2>5. End</h2>
<div class="sectionbody">
<p>That's it. One should now have a good enough understanding to be able to make
some small games, and with a little more exploration, it should be easy to make
much larger things. Oh, and now that one knows how to do the basic setup of a
game, the livecode template in the <em>demos</em> directory provides a nice template
for a simple game.</p>
</div>
<div id="footer">
<div id="footer-text">
Last updated 09-Jan-2008 19:32:55 EDT
</div>
</div>
</body>
</html>
